<link rel="stylesheet" type="text/css" href="resume/gr2015_Resume.css">
<link rel="stylesheet" type="text/css" href="../less/form/form.css">
<link rel="stylesheet" type="text/css" href="../less/banner/banner.css">

<div ng-controller="ResumeCtrl" class="edit-profile-resume row">
    <div class="banner col-xs-12">
        <h1>Edit Your Profile</h1>
    </div>
    <div class="profile-content">
        <div class="profile-content-nav col-sm-4">
            <ul>
                <li><a ng-click="changeSection('projectExperience')" class="nav-cursor">Project Experience</a></li>
                <li><a ng-click="changeSection('education')" class="nav-cursor">Education</a></li>
                <li><a ng-click="changeSection('skills')" class="nav-cursor">Professional Skills</a></li>
                <li><a ng-click="changeSection('others')" class="nav-cursor">Others</a></li>
            </ul>
        </div>
        <div class="profile-content-section col-sm-8">
            <div id="workExperience" ng-form="projectExperience" name="projectExperience">
                <section ng-show="currentSection === 'projectExperience'">
                    <h4>Simple summary</h4>
                    <hr/>
                    <p class="form-notation">Provide a high level description of who you are and what interests you. We will review your skills and goals as we look to match you with roles in the marketplace.</p>
                    <p>Title</p><input type="text" class="form-text form-common" />
                    <p>Summary</p>
                    <textarea class="form-des form-common" name="des" required></textarea>
                    <!-- <p class="help-block" ng-show="projectExperience.des.$invalid && projectExperience.des.$error.maxlength">The length should be less than 200 characters.</p> -->
                    <h5>Project Experience#1</h5><hr/>
                    <p>Company</p>
                    <input type="text" class="form-text form-common" />
                    <p>Position</p>
                    <input type="text" class="form-text form-common" />
                    <p>Date</p><input type="date" class="form-date form-common datepicker" placeholder="start date"><span> &nbsp;&nbsp;to&nbsp;&nbsp; </span><input type="date" class="form-date form-common" placeholder="end date">
                    <p>Project Description</p>
                    <textarea class="form-des form-common"></textarea>
                    <p class="form-notation">Provide a short description of your responsibilities and tasks while in this role.</p>
                    <a href="#">+Add another project experience</a><br/>
                    <input type="button" class="form-button" value="Next">
                </section>
            </div>
            <div id="education">
                <section ng-show="currentSection === 'education'">
                    <h4>Education Background</h4>
                    <hr/>
                    <p>This part is about your education background from your academy</p>
                    <p>Summary</p>
                    <textarea class="form-des form-common"></textarea>
                    <h5>Education#1</h5><hr/>
                    <p>School</p>
                    <input type="text" class="form-text form-common" />
                    <p>Degree</p>
                    <select class="form-select form-common" ng-options="degree for degree in degrees" ng-model="selectedOption">
                    </select>
                    <p>Major</p>
                    <input type="text" class="form-text form-common" />
                    <p>Date</p><input type="date" class="form-date form-common" id="datepicker" placeholder="start date" ><span> &nbsp;&nbsp;to&nbsp;&nbsp; </span><input type="date" class="form-date form-common" placeholder="end date">
                    <p>Simple Description</p>
                    <textarea class="form-des form-common"></textarea>
                    <p class="form-notation">Provide a short description of your study resultes in this stage.</p>
                    <a href="#">+Add another education background</a><br/>
                    <input type="button" class="form-button" value="Next">
                </section>
            </div>
            <div id="skills">
                <section ng-show="currentSection === 'skills'">
                    <h4>Relevant Skills in future Job</h4>
                    <hr/>
                    <p>Please provide your top and basic skiils which will make you outstanding from the competition.</p>
                    <p>Summary</p>
                    <textarea class="form-des form-common"></textarea>
                    <h5>Basic Skills</h5><hr/>
                    <p>Simple Description</p>
                    <textarea class="form-des form-common"></textarea>
                    <p>List</p>
                    <input type="text" class="form-text form-common" />&nbsp;&nbsp;<a href="#"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></a>
                    <p class="form-notation">Click the '+' mark to add additional basic skill. </p>
                    <h5>Professional Skills</h5><hr/>
                    <p>Simple Description</p>
                    <textarea class="form-des form-common"></textarea>
                    <p>List</p>
                    <input type="text" class="form-text form-common" />&nbsp;&nbsp;<a href="#"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></a>
                    <p class="form-notation">Click the '+' mark to add additional professional skill. </p>
                    <p>Other description</p>
                    <textarea class="form-des form-common"></textarea>
                    <p class="form-notation">This is for you to descripe what you have learnt before. </p>
                    <input type="button" class="form-button" value="Next">
                </section>
            </div>
            <div id="others">
                <section ng-show="currentSection === 'others'">
                    <h4>Advantages of the Application</h4>
                    <hr/>
                    <p>Please provide other advantages that may make you beyond others in this application.</p>
                    <p>Summary</p>
                    <textarea class="form-des form-common"></textarea>
                    <h5>Awards</h5><hr/>
                    <p>Title</p>
                    <input type="text" class="form-text form-common" />
                    <p>Issuer</p>
                    <input type="text" class="form-text form-common" />
                    <p>Date</p>
                    <input type="text" class="form-text form-common" />
                    <p>Simple Description</p>
                    <textarea class="form-des form-common"></textarea>
                    <a href="#">+Add another award</a>
                    <h5>Activities</h5><hr/>
                    <p>Name</p>
                    <input type="text" class="form-text form-common" />
                    <p>Date</p>
                    <input type="text" class="form-text form-common" />
                    <p>Simple Description</p>
                    <textarea class="form-des form-common"></textarea>
                    <a href="#">+Add another activity</a><br/>
                    <input class="form-button form-profile" type="submit" value="Save">
                    <input class="form-button form-profile" type="reset" value="Rewrite">
                </section>
            </div>
        </div>
    </div>
</div>